import { ref } from 'vue'
import type { NavLink } from '../types'

export function useHeaderNav() {
  const currentPage = ref<string>('首页')
  const navLinks = ref<NavLink[]>([
    { name: '首页', active: true },
    { name: '检验记录', active: false },
    { name: '规则管理', active: false },
    { name: '设置', active: false }
  ])

  const setActiveLink = (clickedLink: NavLink) => {
    navLinks.value.forEach(link => {
      link.active = link === clickedLink
    })
    currentPage.value = clickedLink.name
  }

  return {
    navLinks,
    currentPage,
    setActiveLink
  }
}